<template>
	<view class="container">
		<view class="" style="display: flex;align-items: center;margin-top: 0px;justify-content: space-between;">
			<view class="tag">头像：</view>
			<image @click="choose" :src="avatar" @error="err" style="height: 60px;width: 60px;border-radius: 60px;"
				mode=""></image>
		</view>
		<view class="" style="display: flex;align-items: center;margin-top: 20px;">
			<view class="tag">昵称：</view>
			<uni-easyinput v-model="user.nickName" placeholder="请输入昵称" />
		</view>
		<view class="" style="display: flex;align-items: center;margin-top: 20px;">
			<view class="tag">联系电话：</view>
			<view class="" @click="modifyPhione" style="display: flex;justify-content: space-between;flex: 1;">
				<view class="">{{user.phonenumber.substr(0,user.phonenumber.length-4)+'****'}}</view>
				
				<uni-icons type="forward"></uni-icons>
			</view>
		</view>
		<view class="" style="display: flex;align-items: center;margin-top: 20px;">
			<view class="tag">身份证号：</view>
			<uni-easyinput v-model="user.idCard" maxlength="18" placeholder="请输入身份证号" />
		</view>
		<view class="" style="display: flex;align-items: center;margin-top: 20px;">
			<view class="tag">邮箱：</view>
			<uni-easyinput v-model="user.email" placeholder="请输入邮箱" />
		</view>
		<view class="" style="display: flex;align-items: center;margin-top: 20px;">
			<view class="tag">性别：</view>
			<radio-group name="" @change="change">
				<label>
					<radio value="0" :checked="user.sex==0" /><text>男</text>
				</label>
				<label style="margin-left: 10px;">
					<radio value="1" :checked="user.sex==1" /><text>女</text>
				</label>
			</radio-group>
		</view>
		<button type="primary" @click="submit" style="margin-top: 20px;">修改</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: {
					"email": "",
					"idCard": "",
					"nickName": "",
					"phonenumber": "",
					"sex": ""
				},
				avatar:""
			};
		},
		onLoad(item) {

		},
		onReady() {

		},
		onShow() {
			this.user = uni.getStorageSync("user")
			this.avatar = this.baseUrl + "/prod-api" + this.user.avatar
		},
		methods: {
			
			modifyPhione() {
				uni.navigateTo({
					url: 'modifyPhone/modifyPhone',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			change(e) {
				this.user.sex = e.detail.value
			},
			err() {
				this.avatar = "/static/tx.png"
			},
			choose(e) {
				uni.chooseImage({
					count:1,
					success() {
						this.avatar = e.tempFilePaths[0]
					}
				})
			},
			submit() {
				uni.uploadFile({
					url: this.baseUrl + '/prod-api/common/upload',
					name: 'file',
					filePath: this.avatar,
					header: {
						Authorization: uni.getStorageSync('token')
					},
					success(e) {
						this.user.avatar = JSON.parse(e.data).fileName
						this.put('/prod-api/api/common/user',this.user).then(res=>{
							if(res.code === 200) {
								this.get('/prod-api/api/common/user/getInfo',{}).then(res=>{
									let data=res.user
									uni.setStorageSync('user',data)
								})
							}
							uni.showToast({
								title: res.msg,
								icon: 'none'
							});
						})
					}
				})
			}
		}
	};
</script>

<style lang="scss">
	page {
		background-color: white;
	}

	.tag {
		width: 6em;
	}
</style>
